<style lang="less" scoped>
  .real-time{
    width: 100%;
    height: 100%;
    &_title{
      height: 40px;
      background: url('~@/images/contenttitle.png');
      background-repeat: no-repeat;
      background-position: bottom;
      text-align: center;
      color: #00F6FF;
      line-height: 40px;
      margin-bottom: 5px;
    }
    &_content{
      height: calc(100% - 45px);
    }
    /deep/.el-table{
      background-color: #1C479F;
    }
    /deep/.el-table th.is-leaf, .el-table td{
      background-color: #0973ca;
      border-bottom: 1px solid #0973ca;
    }
    /deep/.el-table tr{
      background-color: #1C479F;
    }
    /deep/.el-table td{
      border-bottom: 1px solid #00BFE9;
    }
    /deep/.el-table .cell{
      color: #fff;
    }
    /deep/.el-table th > .cell{
      color: #fff;
    }
    /deep/.el-table--medium td{
      padding: 7px 0;
    }
    /deep/.el-table tbody tr:hover >td  {
      background-color: unset !important;
    }
    /deep/.el-table th.gutter, .el-table td.gutter{
      display: none;
    }
    ::-webkit-scrollbar {
      width: 0px;
      height: 0px;
      background-color: #034694;
    }
    ::-webkit-scrollbar-thumb {
      background-color: #0A306F;
      border-radius: 3px;
    }
  }
</style>

<template>
  <div class="real-time">
    <div class="real-time_title">
      <span>{{ rankingTitle }}</span>
    </div>
    <div class="real-time_content">
      <el-table
        v-loading="loading"
        height="100%"
        :data="tableData"
      >
        <el-table-column label="姓名" align="center" prop="name" />
        <el-table-column label="住院号" align="center" prop="inpatient_no" />
        <el-table-column v-if="!isTrauma" label="科室" align="center" prop="departmentName" show-overflow-tooltip />
        <el-table-column v-if="!isTrauma" label="耗时" align="center" prop="dtob" />
        <el-table-column v-if="isTrauma" label="时间(h)" align="center" prop="emergen_stay_hours" />
        <el-table-column v-if="isTrauma" label="年龄(岁)" align="center" prop="age" />
      </el-table>
    </div>
  </div>
</template>

<script>
import { getD2BRanking, getDNTRanking, getTraumaEmergenStayRanking } from '@/api/comprehensive/realTime'
export default {
  props: {
    isStrock: {
      type: String,
      default: 'chestPain'
    }
  },
  data() {
    return {
      setInter: null,
      loading: false,
      isTrauma: false,
      rankingTitle: '实时预警（D2B耗时月度排名）',
      tableData: []
    }
  },
  watch: {
    'isStrock'() {
      this.init()
    }
  },
  mounted() {
    this.init()
    this.setInter = setInterval(() => {
      this.init()
    }, 10000)
  },
  destroyed() {
    clearInterval(this.setInter)
  },
  methods: {
    init() {
      this.isTrauma = false
      // this.loading = true
      // this.tableData = []
      if (this.isStrock == 'chestPain') {
        this.isTrauma = false
        this.rankingTitle = '实时预警（D2B耗时月度排名）'
        getD2BRanking({
          hospitalId: this.$store.getters.hospitalId
        }).then(res => {
          if (res.code == 0) {
            if (res.data && res.data.length > 0) {
              this.tableData = res.data
            } else {
              this.tableData = []
            }
          }
          // this.loading = false
        })
      } else if (this.isStrock == 'stroke') {
        this.isTrauma = false
        this.rankingTitle = '实时预警（DNT耗时月度排名）'
        getDNTRanking({
          hospitalId: this.$store.getters.hospitalId
        }).then(res => {
          if (res.code == 0) {
            if (res.data && res.data.length > 0) {
              res.data.forEach(el => {
                el.dtob = el.dnt
              })
              this.tableData = res.data
            } else {
              this.tableData = []
            }
          }
          // this.loading = false
        })
      } else if (this.isStrock == 'trauma') {
        this.isTrauma = true
        this.rankingTitle = '实时预警（急诊停留时间月度排名）'
        getTraumaEmergenStayRanking({
          hospitalId: this.$store.getters.hospitalId
        }).then(res => {
          if (res.code == 0) {
            if (res.data && res.data.length > 0) {
              this.tableData = res.data
            } else {
              this.tableData = []
            }
          }
          // this.loading = false
        })
      }
    }
  }
}
</script>
